package descentFly.app
{
	import UIFree.uif_styles;
	
	import UIUtils.uif_utilA;
	
	import flash.display.GradientType;
	import flash.text.TextFormatAlign;
	
	import flashx.textLayout.formats.TextAlign;
	
	public dynamic class df_styles extends uif_styles {
		[Embed(source="fonts/Picaresque Two.ttf", embedAsCFF="false", fontFamily="Picaresque", mimeType="application/x-font")]
		private var _Picaresque: Class;

		private static const TAHOMA: String = 'tahoma';
		private static const ARIAL: String 	= 'arial';
		public static const MYFONT: String = 'Picaresque'; 
		
		public function df_styles() {
			super();
			
			this.white = {
				fill_color: 0xFFFFFF,
				fill_alpha: 1
			}
				
			this.application = {
			}
				
			this.defShadow = {
				alpha		: 0.6,
				blurX		: 3,
				blurY		: 3,
				strenth		: 3,
				distance	: 2
			}
				

			this.cb =  {
				buttonMode: true,
				mouseChildren: false
			}
			
			this.modalGurtain = {
				fill_color: 0,
				fill_alpha: 0.4
			}
				
			this.titleFilters = {
				glow: {
					color: 0,
					blurX: 2,
					blurY: 2
				},
				shadow: {
					color		: 0x50E0FF,
					distance	: 0,
					blurX		: 4,
					blurY		: 4
				}
			}
				
			this.block = {
				draw_method	: 'tileBack',
				fill_color	: {
					colors		: [0, 0x333333],
					rotation	: Math.PI / 2
				},
				back		: {
					psize		: [3, 3],
					padding		: 5,
					tileFill	: {
						colors	: [0, 0], 
						alphas	: [0.8, 0.3]
					}
				},
				line_width	: 1,
				line_color	: 0x333333
			}

			this.panel = merge('block', {
				padding		: 5,
				filters		: {
					shadow	: this.defShadow
				}
			});
			
			this.mgPanel = uif_utilA.union(this.block, {
				padding		: 3,
				fill_color	: {
					rotation	: Math.PI / 2 * 3
				}
			});
			
			this.description = {
				line_width: 1,
				line_color: 0xCCCDDD,
				rounds: 6,
				padding: 10,
				valign: true,
				text_format: {
					font: ARIAL,
					size: 11,
					multiline: true,
					wordWrap: true
				}
			}
			
			this.window = merge('block', {
				title		: 'windowTitle',
				rounds		: 10,
				padding		: 10,
				/*layer		: {
					fill_color: 0xFFFFFF,
					fill_alpha: 0.2
				},*/
				buttons		: {
					fill_color	: 0,
					fill_alpha	: 0.4,
					padding		: 5
				},
				filters		: {
					shadow: this.defShadow
				},
				description	: {
					text_format: {
						font		: ARIAL,
						color		: 0xFFFFFF,
						size		: 11,
						selectable	: false,
						multiline: true,
						wordWrap: true
					}
				}
			});
			
			this.chatWindow = uif_utilA.union(this.window, {
				fill_color	: {
					alphas		: [0.2, 0.2]
				}
			});
			
			this.windowTools = merge('window', {
				gurtain : 'modalGurtain2'
			});			

			this.cross = {
				line_width	: 2,
				fill_color	: 0,
				fill_alpha	: 1,
				padding		: 4,
				component	: this.cb,
				round: {
					line_width: 4,
					line_color: 0xFFFFFF,
					fill_color: 0,
					fill_alpha: 1
				}
			}
			
			this.closeButton = merge('cross', {
				line_color: 0xFFFFFF
			})
				
			
			this.progressBar = {
				fill_color	: 0x333344,
				fill_alpha	: 0.8,
				line_width	: 1,
				line_color	: 0x223333,
				rounds		: 4,
				padding		: 1,
				bar			: {
					fill_color: 0x454DDC,
					fill_alpha: 1,
					line_color: 0x001133,
					file_width: 1,
					rounds	  : 2
				}
			};
			
			this.label = {
				text_format: {
					font		: MYFONT,
					color		: 0xFFFFFF,
					size		: 10,
					selectable	: false,
					component: {
						embedFonts: true
					}
				},
				filters: {
					glow: {
						color: 0x0
					}
				}
			}
				
			this.paramLabel = {
				text_format: {
					font		: MYFONT,
					color		: 0xFFFFFF,
					size		: 10,
					selectable	: false,
					align		: TextAlign.RIGHT,
						component	: {
							embedFonts: true
						}
				}
			}
				
			this.inputLayer = {
				padding	: 5,
				label	: this.paramLabel,
				input	: {
					text_format: {
						font		: ARIAL,
						color		: 0,
						size		: 12
					},
					fill_color: 0xFFFFFF,
					fill_alpha: 1,
					line_width: 1,
					line_color: 0
				}
			}
				
			this.button = {
				line_color: 0,
				line_width: 1,
				line_alpha: 0.5,
				rounds		: 15,
				padding		: 4,
				margin		: 2,
				fill_color: {
					colors	: [0x0, 0x555555],
					type	: GradientType.RADIAL,
					focalPointRatio: 0.5
				},
				text_format: {
					font	: MYFONT,
					size	: 9,
					color	: 0xB3C8FF,
					align	: TextFormatAlign.CENTER,
					component: {
						embedFonts: true
					}
				},
				hotspot: {
					rounds: [12, 12, 3, 3],
					fill_color: {
						colors: [0xFFFFFF, 0xFFFFFF],
						alphas: [0.6, 0.2],
						rotation: Math.PI / 2,
							type: GradientType.RADIAL
					}
				},
				arrow: 'farrow',
				filters: {
					glow: {
						color: 0xFFFFFF,
						alpha: 0.3,
						blurX: 3,
						blurY: 3,
						inner: true
					},
					shadow: {
						color	: 0xFFFFFF,
						alpha	: 0.3,
						distance: 3,
						angle: 45,
						blurX: 4,
						blurY: 4,
						strength: 1
					}
				},
				focusStyle		: 'bgfocus',
				checkedStyle	: 'bgchecked',
				progressBar		: 'progress'
			}
				
			this.bgfocus = {
				line_color: 0,
				line_alpha: 1,
				fill_color: {
					colors: [0x0000FF, 0x888FFF],
					alphas: [1, 1]
				},
				filters: {
					shadow: {
						color	: 0x0000FF,
						alpha	: 0.8,
						distance: 0,
						angle: 45,
						blurX: 6,
						blurY: 6,
						strength: 2
					}
				},
				arrow: 'farrow-focus',
				hotspot: {
					fill_color: {
						colors	: [0xFFFFFF, 0xFFFFFF],
						alphas	: [0.1, 0.7],
						rotation: Math.PI / 4,
						type	: GradientType.LINEAR
					}
				},
				text_format: {
					color: 0
				}
			}			

			this.windowTitle = {
				line_width: 2,
				line_color: 0xFFFFFF,
				fill_color: {
					rotation: Math.PI / 2,
					colors: [0x666666, 0x0],
					alphas: [1, 1]
				},
				rounds	: 5,
				padding	: 2,
				valign	: true,
				text_format: {
					font	: MYFONT,
					size	: 12,
					color	: 0xDDDDDD,
					align	: TextFormatAlign.CENTER,
					component: {
						embedFonts: true
					}
				},
				component: this.cb
			}
				
			this.levelItem = {
				margin		: 3,
				padding		: 4,
				fill_color	: 0xFFFFFF,
				fill_alpha	: 0.3,
				layer		: {
					padding		: 5,
					line_width: 0,
					line_color: 0
				}
			}
				
			this.levelItemSel = merge('levelItem', {
				layer		: {
					line_width: 4,
					line_color: 0x00FF00
				}
			});
				
			this.list = {
				fill_color	: 0,
				fill_alpha	: 0.4,
				itemClass	: 'levelItem',
				selectClass	: 'levelItemSel',
				scrollBar	: 'scrollBar'
			}
				
			this.scrollBar = {
				fill_color	: 0,
				fill_alpha	: 0.3,
				line_width	: 1,
				line_color	: 0,
				line_alpha	: 0.3,
				padding		: 1,	
				rounds		: 8,
				handle		: {
					fill_color	: 0x454DDC,
					fill_alpha	: 0.8,
					line_width	: 1,
					line_color	: 0,
					line_alpha	: 0.3,
					rounds		: 5,
					component	: this.cb
				}
			}
			
			this.levelTitle = {
				text_format: {
					font		: MYFONT,
					color		: 0xFFFFFF,
					size		: 20,
					selectable	: false,
					component: {
						embedFonts: true
					}
				},
				filters: this.titleFilters
			}
				
			this.description = {
				text_format: {
					font		: ARIAL,
					color		: 0xC0D0D8,
					multiline	: true,
					wordWrap	: true,
					size		: 11,
					selectable	: false
				}
			}
				
			this.levelDescription = {
				text_format: {
					font		: ARIAL,
					color		: 0xC0D0D8,
					multiline	: true,
					wordWrap	: true,
					size		: 11,
					selectable	: false
				}
			}
				
			this.info = {
				line_width	: 1,
				line_color	: 0xFFFFFF,
				line_alpha	: 0.3,
				padding		: 8,
				rounds		: 10
			};
				
			this.chat = this.info;
				
			this.chatList = {
				fill_color	: 0x777777,
				fill_alpha	: 0.2,
				scrollBar	: 'scrollBar',
				padding		: 4
			}
				
			this.chatItem = {
				padding		: 4,
				title		: {
					text_format: {
						font		: MYFONT,
						color		: 0xC3D8FF,
						size		: 11,
						selectable	: false,
						component: {
							embedFonts: true
						}
					},
					filters: this.titleFilters
				},
				message		: this.levelDescription
			}
				
			this.input = {
				line_width: 1,
				line_color: 0xFFFFFF,
				line_alpha: 0.4,
				text_format: {
					font		: ARIAL,
					color		: 0xAAAAAA,
					wordWrap	: true,
					size		: 11,
					selectable	: false
				}
			}
				
			this.point = {
				fill_alpha	: 1,
				draw_method	: 'draw_ellipse'
			};
			
			this.radarLayer = {
				line_color	: 0x22ff33,
				line_width	: 1,
				line_alpha	: 0.6,
				rounds		: 20,
				margin		: 4,
				line		: {
					line_width: 2,
					line_color: 0x00FF00
				},
				point0		: merge('point', {fill_color: 0xFFFFFF}),
				point1		: merge('point', {fill_color: 0xFFFF00}),
				point2		: merge('point', {fill_color: 0x00FFFF})
			}
				
			this.monitor = {
				line_width	: 1,
				line_color	: 0,
				line_alpha	: 0.6,
				rounds		: 25,
				padding		: 5,
				fill_color	: {
					colors	: [0x006600, 0x004400],
					type	: GradientType.RADIAL
				},
				hotspot: {
					rounds: [20, 20, 10, 10],
					fill_color	: {
						colors	: [0xFFFFFF, 0xFFFFFF],
						alphas	: [0.6, 0.2],
						rotation: Math.PI / 2,
						type	: GradientType.RADIAL
					},
					heightPercent: 0.3
				},
				radarLayer: 'radarLayer',
				filters: {
					glow: {
						color: 0xFFFFFF,
						alpha: 0.4,
						blurX: 12,
						blurY: 12,
						inner: true
					},
					shadow: {
						color	: 0xFFFFFF,
						alpha	: 0.3,
						distance: 3,
						angle: 45,
						blurX: 4,
						blurY: 4,
						strength: 1
					}
				}
			}
				
			this.indArrow = {
				fill_color: 0x005500,
				fill_alpha: 1,
				line_color: 0,
				line_alpha: 1
			}
				
			this.arrow = {
				padding	: 2,
				arrow	: 'indArrow',
				filters: {
					shadow: {
						distance: 2,
						color	: 0xFFFFFF,
						alpha	: 0.5,
						angle	: 45,
						blurX	: 3,
						blurY	: 3,
						strength: 1.2
					},
					glow: {
						color: 0x66FF66,
						inner: true
					}
				}
			}
				
			this.toolLabel = {
				text_format: {
					font		: MYFONT,
					color		: 0xFFFFFF,
					size		: 10,
					selectable	: false,
					align		: TextAlign.CENTER,
					component: {
						embedFonts: true
					}
				},
				filters: {
					glow: {
						color: 0x0
					}
				}
			}
				
			this.toolLabelLeft = merge(this.toolLabel, {
				text_format: {
					font		: MYFONT,
					color		: 0xFFFFFF,
					size		: 10,
					selectable	: false,
					align		: TextAlign.LEFT,
					component: {
						embedFonts: true
					}
				}
			});
				
			this.playerParam = {
				padding: 2,
				text_format: {
					font		: ARIAL,
					size		: 11,
					selectable	: false,
					color		: 0xFFFFFF
				}
			}
				
			this.param = {
				line_width	: 1,
				line_color	: 0xFFFFFF,
				line_alpha	: 0.3,
				fill_color	: 0,
				fill_alpha	: 0.1,
				margin		: 2,
				label: uif_utilA.union(this.playerParam, {
					text_format	: {
						color	: 0x880000,
						align	: TextFormatAlign.RIGHT
					}
				}),
				value: this.playerParam
			}
				
			this.transButton = merge('info', {
				padding		: 3,
				arrow		: 'indArrow'				
			});
			
			this.playerInfo = merge('info', {
				login: {
					padding		: 5,
					text_format	: {
						font	: MYFONT,
						size	: 12,
						color	: 0xFFFFFF,
						selectable	: false,
						align	: TextFormatAlign.CENTER,
						component: {
							embedFonts: true
						}
					},
					filters: {
						glow: {
							color: 0
						}
					}
				},
				param1: uif_utilA.union(this.param, {label: {text_format : {color: 0x00FF00}}}),
				param2: uif_utilA.union(this.param, {label: {text_format : {color: 0xFF0000}}})
			});
			
			this.menuItem = {
				fill_color	: {
					colors: [0x5977B3, 0x002233],
					alphas: [0, 0],
					type: 'radial'
				},
				rounds		: 3,
				padding		: 3,
				text_format: {
					font	: ARIAL,
					size	: 11,
					color	: 0xAAAAAA
				},
				component: {
					mouseChildren	: false,
					buttonMode		: true
				},
				overClass: 'menuItemFocus'
			}
			
			this.menuItemFocus = uif_utilA.union(this.menuItem, {
				fill_color	: {
					alphas: [1, 1]
				},
				text_format: {
					color	: 0xFFFFFF
				}
			});
			
			this.popupmenu = {
				fill_color	: 0,
				fill_alpha	: 0.8,
				line_color	: 0x888888,
				line_width	: 1,
				padding		: 8,
				item		: 'menuItem',
				filters: {
					shadow: {
						blurX: 5,
						blurY: 5,
						distance: 3
					}
				}
			}
				
			this.checkbox = uif_utilA.union(this.paramLabel, {
				margin: 3,
				text_format: {
					align: TextAlign.LEFT
				},
				hotspot: {
					margin: 4,
					rounds: 2,
					line_width: 2,
					line_color: 0xFFFFFF, 
					fill_color: {
						colors: [0xFFFFFF, 0xFFFFFF],
						rotation: Math.PI / 2
					},
					fill_alpha: 1,
					filters:{
						glow: {
							blurX: 2,
							blurY: 2
						}
					}
				},
				checkedStyle: 'cbChecked'
			});
			
			this.cbChecked = uif_utilA.union(this.checkbox, {
				hotspot: {
					fill_color: {
						colors: [0x33FF33, 0x004400]
					}
				}
			});
			
			this.ring = {
				line_color	: 0xFF0000,
				line_width	: 1,
				line_alpha	: 1,
				label		: {
					text_format: {
						font: ARIAL,
						size: 9,
						selectable: false,
						color: 0xFF0000,
						align: TextAlign.CENTER
					}
				}
			}
		}
	}
}